<

flutter_driver からの移行

このページでは、を使用して既存のプロジェクトを移行する方法について説明します。flutter_driverintegration_testパッケージ、 統合テストを実行するため。

によるテストintegration_testと同じ方法を使用します で使われるウィジェットのテスト

の紹介としては、integration_testパッケージ、 をチェックしてください結合テストガイド。

スターターサンプルプロジェクト

このガイドのプロジェクトは、次のような小さなデスクトップ アプリケーションの例です。 機能:

  • 左側には、ユーザーがスクロールできる植物のリストがあります。 タップして選択します。
  • 右側には植物名を表示する詳細画面があります そして種。
  • アプリの起動時に植物が選択されていない場合、ユーザーに選択を求めるテキストが表示されます。 植物が展示されている
  • 植物のリストは、次の場所にあるローカル JSON ファイルからロードされます。 アセットフォルダー。

Starter project screenshot

完全なコード例は次の場所にあります。サンプルプロジェクトフォルダ。

既存のテスト

プロジェクトには 3 つの要素が含まれていますflutter_driverテスト 次のチェックを実行します。

  • アプリの初期状態を確認します。
  • 植物のリストの最初の項目を選択します。
  • スクロールして植物のリストの最後の項目を選択します。

テストは以下に含まれていますtest_driverフォルダ、 の中でmain_test.dartファイル。

このフォルダーには、という名前のファイルもありますmain.dart、 メソッドの呼び出しが含まれていますenableFlutterDriverExtension()。 を使用する場合、このファイルは不要になりますintegration_test

設定

使用を開始するには、integration_testパッケージ、 を追加しますintegration_testに pubspec.yaml ファイルをまだ作成していない場合は、次のようにします。

dev_dependencies:
  integration_test:
    sdk: flutter

次に、プロジェクト内に新しいディレクトリを作成します。integration_test/、そこにテストファイルを作成します 次の形式で:<name>_test.dart

テスト移行

このセクションには、既存の移行方法に関するさまざまな例が含まれていますflutter_driverへのテストintegration_testテスト。

例: ウィジェットが表示されることを確認する

アプリを起動すると右の画面が表示されます ユーザーにリスト上の植物の 1 つを選択するように求めるテキスト。

このテストでは、テキストが表示されることを確認します。

flutterドライバー

flutter_driver、テストでは使用しますwaitFor、 まで待機しますfinderウィジェットを見つけることができます。 ウィジェットが見つからない場合、テストは失敗します。

test('do not select any item, verify please select text is displayed',
    () async {
  // Wait for 'please select' text is displayed
  await driver.waitFor(find.text('Please select a plant from the list.'));
});

統合テスト

integration_test次の 2 つの手順を実行する必要があります。

  1. まず、次を使用してメイン アプリ ウィジェットをロードします。 のtester.pumpWidget方法。

  2. 次に、使用しますexpectマッチャーでfindsOneWidget検証します ウィジェットが表示されていることを確認します。

testWidgets('do not select any item, verify please select text is displayed',
    (tester) async {
  // load the PlantsApp widget
  await tester.pumpWidget(const PlantsApp());

  // wait for data to load
  await tester.pumpAndSettle();

  // Find widget with 'please select'
  final finder = find.text('Please select a plant from the list.');

  // Check if widget is displayed
  expect(finder, findsOneWidget);
});

例: タップアクション

このテストでは、リストの最初の項目に対してタップ アクションを実行します。 これはListTile「アルダー」という文字が入っています。

タップ後、テストは詳細が表示されるまで待機します。 この場合、「Alnus」というテキストを含むウィジェットが追加されるまで待機します。 表示される。

また、テストではテキストが 「リストから植物を選択してください。」 が表示されなくなりました。

flutterドライバー

flutter_driver、 使用driver.tap実行する方法 ファインダーを使用してウィジェットをタップします。

ウィジェットが表示されないことを確認するには、 使用waitForAbsent方法。

test('tap on the first item (Alder), verify selected', () async {
  // find the item by text
  final item = find.text('Alder');

  // Wait for the list item to appear.
  await driver.waitFor(item);

  // Emulate a tap on the tile item.
  await driver.tap(item);

  // Wait for species name to be displayed
  await driver.waitFor(find.text('Alnus'));

  // 'please select' text should not be displayed
  await driver
      .waitForAbsent(find.text('Please select a plant from the list.'));
});

統合テスト

integration_test、 使用tester.tapタップアクションを実行します。

タップアクションの後、次の電話番号を呼び出す必要があります。tester.pumpAndSettle待つ アクションが完了し、UI の変更がすべて行われるまで。

ウィジェットが表示されないことを確認するには、同じコマンドを使用します。expectで機能しますfindsNothingマッチャー。

testWidgets('tap on the first item (Alder), verify selected',
    (tester) async {
  await tester.pumpWidget(const PlantsApp());

  // wait for data to load
  await tester.pumpAndSettle();

  // find the item by text
  final item = find.text('Alder');

  // assert item is found
  expect(item, findsOneWidget);

  // Emulate a tap on the tile item.
  await tester.tap(item);
  await tester.pumpAndSettle();

  // Species name should be displayed
  expect(find.text('Alnus'), findsOneWidget);

  // 'please select' text should not be displayed
  expect(find.text('Please select a plant from the list.'), findsNothing);
});

例: スクロール

このテストは前のテストと似ていますが、 しかし、下にスクロールして、代わりに最後の項目をタップします。

flutterドライバー

下にスクロールするにはflutter_driver、 使用driver.scroll方法。

スクロールアクションを実行するにはウィジェットを提供する必要があります。 スクロールの継続時間も同様です。

スクロール アクションの合計オフセットも指定する必要があります。

test('scroll, tap on the last item (Zedoary), verify selected', () async {
  // find the list of plants, by Key
  final listFinder = find.byValueKey('listOfPlants');

  // Scroll to the last position of the list
  // a -100,000 pixels is enough to reach the bottom of the list
  await driver.scroll(
    listFinder,
    0,
    -100000,
    const Duration(milliseconds: 500),
  );

  // find the item by text
  final item = find.text('Zedoary');

  // Wait for the list item to appear.
  await driver.waitFor(item);

  // Emulate a tap on the tile item.
  await driver.tap(item);

  // Wait for species name to be displayed
  await driver.waitFor(find.text('Curcuma zedoaria'));

  // 'please select' text should not be displayed
  await driver
      .waitForAbsent(find.text('Please select a plant from the list.'));
});

統合テスト

integration_test、メソッドを使用できますtester.scrollUntilVisible

スクロールするウィジェットを提供する代わりに、 探している項目を入力してください。 この場合、検索しているのは、 「Zedoary」というテキストが入ったアイテム、 これはリストの最後の項目です。

このメソッドは、Scrollableウィジェット そして、指定されたオフセットを使用してスクロールアクションを実行します。 このアクションは、項目が表示されるまで繰り返されます。

testWidgets('scroll, tap on the last item (Zedoary), verify selected',
    (tester) async {
  await tester.pumpWidget(const PlantsApp());

  // wait for data to load
  await tester.pumpAndSettle();

  // find the item by text
  final item = find.text('Zedoary');

  // finds Scrollable widget and scrolls until item is visible
  // a 100,000 pixels is enough to reach the bottom of the list
  await tester.scrollUntilVisible(
    item,
    100000,
  );

  // assert item is found
  expect(item, findsOneWidget);

  // Emulate a tap on the tile item.
  await tester.tap(item);
  await tester.pumpAndSettle();

  // Wait for species name to be displayed
  expect(find.text('Curcuma zedoaria'), findsOneWidget);

  // 'please select' text should not be displayed
  expect(find.text('Please select a plant from the list.'), findsNothing);
});